<template>
	<el-main class="nopadding" style="overflow: hidden; margin: 15px 0px;">
		<el-row :gutter="15">
			<el-col :lg="24">
				<el-card shadow="never" style="margin: 0px; padding: 0px;">
					<jdEcharts height="300px" :option="option"></jdEcharts>
				</el-card>
			</el-col>
		</el-row>
	</el-main>
</template>

<script>
	import jdEcharts from '@/components/jdEcharts';

	/**
	 * 引入组件 @/components/scEcharts
	 * 组件内部会自动加载主题 @/components/scEcharts/echarts-theme-T.js
	 * 支持props包括 height，width，option
	 * 组件export百度Echarts所有方法，使用方式: new scEcharts[fun]
	 */

	export default {
		name: 'chart',
		title: "应用日志",
		icon: "el-icon-data-line",
		description: "",
		components: {
			jdEcharts
		},
		data() {
			return {
				option: {
					title: {
						text: '应用日志',
						subtext: '近15天日志记录',
					},
					color: ['#409eff','#e6a23c','#f56c6c'],
					grid: {
						top: '80px'
					},
					tooltip: {
						trigger: 'axis'
					},
					xAxis: {
						type: 'category',
						boundaryGap: false,
						axisLabel: {
							interval:0,
							rotate:25
						},
						data: ['4月23日','4月24日','4月25日','4月26日','4月27日','4月28日','4月29日','4月30日','5月1日', '5月2日', '5月3日', '5月4日', '5月5日', '5月6日', '5月7日']
					},
					yAxis: {
						type: 'value'
					},
					series: [
						{
							data: [0, 200, 150, 80, 70, 0, 130, 5, 200, 150, 1, 70, 110, 130, 150],
							type: 'bar',
							stack: 'log',
							barWidth: '18px',
						},
						{
							data: [0, 200, 150, 80, 70, 0, 130, 5, 200, 150, 1, 70, 110, 130, 150],
							type: 'bar',
							stack: 'log',
							barWidth: '18px',
						},
						{
							data: [0, 0, 0, 120, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
							type: 'bar',
							stack: 'log',
							barWidth: '15px'
						}
					]
				},
			}
		},
		mounted() {

		},
		methods: {

		},
		beforeUnmount() {

		}
	}
</script>

<style lang="scss">

</style>
